import React from "react";
import Confirm from "../../common/Confirm";
/*导出组件*/
export default class Pagination extends React.Component {
    constructor(props) {
        super(props)
        this.style = {
            page_ensure: {
                width: '39px',
                height: '19px',
                backgroundColor: "white",
                border: '1px solid #e7e6e6',
                borderRadius: '2px',
                color: "#999"
            }
        }
        this.state = {
            pageSize: 0,
            dataSize: 0,
            eachSize: 0,
            text: 1,
            disabled: false
        }
    }


    componentWillMount() {
    }

    componentWillReceiveProps(nextProps) {
        let eachSize = this.props.eachSize;
        let dataSize = nextProps.dataSize
        let pageSize = Math.ceil(dataSize / eachSize)
        this.setState({
            pageSize: pageSize,
            dataSize: dataSize,
            eachSize: eachSize,
        })
    }

    changePageNum(e) {
        let numtest = /^[0-9]*$/;
        let text = e.target.value;
        if (!numtest.test(text)) {
            return
        }
        let datasize = this.state.dataSize;
        let eachSize = this.state.eachSize;
        let num = datasize % eachSize == 0 ? parseInt(datasize / eachSize) : parseInt(datasize / eachSize) + 1;
        if (text > num) {
            text = num;
        }


        if (text < 1) {
            return
        }
        this.setState({
            text: text
        });
    }

    sure(size, num) {
        this.props.onSure(size, num);
    }

    left(size, num) {
        if (this.state.text == 1) {
            return
        }
        this.setState({
            text: parseInt(num) - 1
        })
        this.props.onSure(size, parseInt(num) - 1);
    }

    right(size, num) {
        let datasize = this.state.dataSize;
        let eachSize = this.state.eachSize;
        let nums = datasize % eachSize == 0 ? parseInt(datasize / eachSize) : parseInt(datasize / eachSize) + 1;
        if (this.state.text > nums) {
            this.state.text = nums;
        }
        if (this.state.text >= this.state.pageSize) {
            return
        }
        this.setState({
            text: parseInt(num) + 1
        })
        this.props.onSure(size, parseInt(num) + 1);
    }

    render() {
        return (
            <div className="lot_modify">
                <ol className="page_code" style={{display: "this.state.disabled"}}>
                    <li className="page_li1">总计<span>{this.state.dataSize}</span>条</li>
                    <li className="page_li2">每页<span>{this.state.eachSize}</span>条</li>
                    <li className="page_li3">共<span>{this.state.pageSize}</span>页</li>
                    <li>第&nbsp;&nbsp;<input type="text" className="page_input" value={this.state.text}
                                            onChange={this.changePageNum.bind(this)}/>&nbsp;&nbsp;页
                    </li>
                    <li><Confirm tcontext={'确定'} style={this.style.page_ensure}
                                 touch={this.sure.bind(this, this.state.eachSize, this.state.text)}/></li>
                    <li className="page_button_two">
                        <i className="page_button page_left"
                           onClick={this.left.bind(this, this.state.eachSize, this.state.text)}/>
                        <i className="page_button page_right"
                           onClick={this.right.bind(this, this.state.eachSize, this.state.text)}/>
                    </li>
                </ol>
            </div>
        )
    }
}